<template>
	<view>
		<!-- 公告列表 -->
		<cus-navbar navbar :title="$t('index67')"></cus-navbar>
		
		<view class="main-padding">
			<view class="gap-30"></view>
			<view class="main-card mb-15" v-for="(item,index) in list" :key="index" @click="goDetail(index)">
				<view class="flex justify-between align-center">
					<view class="flex align-center">
						<view class="mr-10" v-if="item.is_read==2">
							<uni-icons type="smallcircle-filled" color="#01FF9A" size="10"></uni-icons>
						</view>
						<view class="size-30 line-1 notice-title">{{item.name}}</view>
					</view>
					<view class="color-59 size-24">{{item.create_at}}</view>
				</view>
				<view class="line-1 color-71 size-26 mt-20">{{stripHtml(item.content)}}</view>
			</view>
			<cus-empty v-show="list.length==0"></cus-empty>
			<uni-load-more :status="loadStatus"></uni-load-more>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				page:1,
				limit:10,
				loadStatus:'loading'
			}
		},
		onLoad() {
			this.loadData(true)
		},
		onPullDownRefresh() {
			this.loadData(true, true)
		},
		onReachBottom() {
			if(this.loadStatus=='noMore')return
			this.page++
			this.loadData()
		},
		methods: {
			loadData(flag, refresh){
				if(flag)this.page=1
				this.loadStatus = 'loading'
				this.$api.post('/data/api.auth.invest/noticeList',{
					page:this.page,
					limit:this.limit
				}).then(res=>{
					this.list = res.list
					this.loadStatus = res.list.length==this.limit?'more':'noMore'
					if(refresh)uni.stopPullDownRefresh()
				})
			},
			stripHtml(str){
				return str.replace(/<[^<>]+>/g,"").replace(/&nbsp;/gi,"");
			},
			goDetail(index){
				let data = this.list[index]
				if(data.is_read==2){
					data.is_read = 1
					this.$set(this.list, index, data)
				}
				uni.navigateTo({
					url:`/pages/notice/noticeDetail?id=${data.id}`
				})
			}
		}
	}
</script>

<style lang="scss">
.notice-title{
	width: 350rpx;
}
</style>